<div class="loading-container"><div class="loader"></div></div>

<div class="loading-waiter">
	<div class="loader">
		<div class="texting">请稍后...</div>
		<div class="spinner">
		  <div class="rect1"></div>
		  <div class="rect2"></div>
		  <div class="rect3"></div>
		  <div class="rect4"></div>
		  <div class="rect5"></div>
		</div>
	</div>
</div>

<div class="wrapper wrapper-shadow wrapper-list"> 
	<!-- list data wrapper -->
	<div class="result-wrapper no-padding">
   	<div class="result-body">
   		<div class="tabs">
      	<ul class="nav nav-tabs widget no-margin-bottom">
        	<li class="active"> 
         		<a href="#tab-content" data-toggle="tab"> 
         			<span class="menu-icon"><i class="fa fa-bar-chart"></i></span> 班级续费表
           	</a>
         	</li>
        </ul>
        <div class="tab-content no-border xs-padding">
					<div class="tab-pane active" id="tab-content" style="padding:10px 0;">
           	<div class="search-panel" style="margin-bottom: 10px;">
           		<form class="form-inline" id="search-form" action="/miwawa/{dbname}/common/procedure/call" method="post">
           			<div class="form-group">
							    <label for="from">截止时间：</label>
									<div class="input-group date date-selector">
										<input id="over" type="text" class="form-control" placeholder="截止时间"> 
										<span class="input-group-addon">
											<span class="fa fa-calendar"></span>
										</span>
									</div>
									
									<label for="from">课时数：</label>
									<div class="input-group">
										<input id="lessons" type="text" class="form-control" placeholder="课时" style="width: 60px;" value="8"> 
										<span class="input-group-addon">以内</span>
									</div>
									
									<button type="button" class="btn btn-warning" onclick="handlerReset();">重置</button>
									<button type="button" class="btn btn-primary" onclick="handlerQuery();">统计</button>
									<button type="button" class="btn btn-success" onclick="handlerExport();">导出</button>
							  </div>
           		</form>
           	</div>
           	<table data-ajax="handlerQuery" 
           				 data-method="post" 
           				 data-id-field="id" 
           				 data-unique-id="id" 
           				 data-pagination="true" 
           				 data-check-on-init="true" 
           				 data-click-to-select="true" 
           				 data-side-pagination="server" 
           				 data-mobile-responsive="true" 
           				 data-event-onload="handlerSuccess" 
           				 id="table-report-resign" class="bootstrap-table">
							<thead>
								<tr>
									<th data-checkbox="true"></th>
									<th data-field="lesson" 	data-align="center">课程名</th>
									<th data-field="name" 		data-align="center">班级</th>
									<th data-field="teacher" 	data-align="center">老师</th>
									<th data-field="should" 	data-align="center">应续费人数</th>
									<th data-field="already" 	data-align="center">续费人数</th>
									<th data-field="percent" 	data-align="center" data-formatter="renderPercent">续费率</th>
									<th data-field="price"  	data-align="center">金额</th>
								</tr>
							</thead>
						</table>
        	</div>
      	</div>
    	</div>
   	</div>
	</div>

	<!-- form editor wrapper -->
	<div class="editor-wrapper">
		
	</div>
</div>
<!-- PAGE CONTENT END =============================================== -->

<form id="export-form" action="/miwawa/{dbname}/common/procedure/export" method="post">
	<input type="hidden" name="name" value="班级续费表"/>
</form>

<!-- Javascript ===================================================== -->
<script src="/miwawa/resources/lib/miwawa/1.0.2/js/core/requirejs/require.js"></script>

<script type="text/javascript">
<!--
	jQuery(function(){
		require(['/miwawa/resources/lib/miwawa/1.0.2/js/core/module/app/simple.js','jquery.plugin.form'],function(simple,form){
			simple(['registerForm','registerTable','registerWidget']);
			
			form.datepicker(".date-selector",{defaultDate:null});
			
			form.tooltip("[data-toggle='tooltip']");
		});
	});
	
	// 重置查询条件
	function handlerReset(){
		jQuery("#search-form").resetForm();
	}
	
	// 导出
	function handlerExport(){
		var action = jQuery("#export-form").attr("action").replace("{dbname}", dbname);
		jQuery("#export-form").attr("action", action);
		jQuery(":hidden[name='params[html]']","#export-form").remove();
		jQuery("#export-form").append('<input type="hidden" name="params[html]"/>');
		jQuery(":hidden[name='params[html]']","#export-form").val(jQuery(".fixed-table-body").html());
		jQuery("#export-form")[0].submit();
	}
	
	// 统计
	function handlerQuery(params){
		if(params){
			var _opts = {};
			if(typeof(params.data) == "string") _opts = jQuery.parseJSON(params.data);
			
			jQuery.ajaxsend({
				url:"/miwawa/{dbname}/common/procedure/call".replace("{dbname}",dbname),
				data:{
					"name":"pro_report_resign_month",
					"params":{
						"_over":jQuery("#over").val(),
						"_lessons":jQuery("#lessons").val(),
						"_offset":_opts.offset,
						"_limit":_opts.limit
					}
				},
				beforeSend:function(){
					jQuery.utils.loading("正在准备统计数据，请稍后...", "show");
					return true;
				},
				success:function(data){
					params.success(data);
					params.complete();
					jQuery.utils.loading(null, "hide");
				}
			});
		}else{
			jQuery("#table-report-resign").bootstrapTable("refresh");
		}
	}
	
	function renderPercent(value, row, index){
		return row.should && row.should > 0 ? (row.already/row.should*100)+'%' : '0%'; 
	}
//-->
</script>
